<template>
	<div>
		<el-row :gutter="15">
			<el-form ref="role" :model="role" size="medium" label-width="101px" label-position="left">
				
				<el-col :span="12">
					<el-form-item label="角色名称" prop="roleName">
						<el-input v-model="role.roleName" placeholder="请输入角色名称" clearable :style="{width: '100%'}">
						</el-input>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label-width="140px" label="创建时间" prop="createtime">
						<el-date-picker v-model="role.createtime" format="yyyy-MM-dd" value-format="yyyy-MM-dd"
							:style="{width: '100%'}" placeholder="请输入创建时间" clearable></el-date-picker>
					</el-form-item>
				</el-col>
			</el-form>
		</el-row>
		<div slot="footer">
			<el-button type="primary" @click="save">确定</el-button>
			<el-button @click="close">取消</el-button>
		</div>
	</div>
</template>
<script>
	export default {
		name: 'LoroleEdit',
		props: ['editid'],
		data() {
			return {
				role: {
					roleId:'',
					roleName: undefined,
					createtime: undefined
				},
				url: '/role/save'
			}
		},
		computed: {},
		watch: {},
		created() {
			if (this.editid) {
				// 通过id 读原始数据
				this.axios.get('/role/getOne', response => {
					this.role = response.obj;
				}, {
					id: this.editid
				})
			}
		},
		mounted() {},
		methods: {
			save() {
				console.log(this.role);
				this.$refs['role'].validate((valid) => {
					if (valid) {
						console.log(valid);
						this.axios.post(this.url, response => {
							console.log(response.obj);
							// 子组件要改变父组件的值
							this.$emit('update:show', false);
							this.$emit('update:editid', null);
							this.$emit('getData');
						}, this.role)
					}
				})
			},
			close(){
				this.$emit('update:show',false);
			}
		}
	}
</script>
<style>
</style>
